<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<!--
   Copyright (C) 2006, 2007  Stephane Alnet

   This program is free software; you can redistribute it and/or
   modify it under the terms of the GNU General Public License
   as published by the Free Software Foundation; either version 3
   of the License, or (at your option) any later version.

   This program is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.

   You should have received a copy of the GNU General Public License
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
   


   For more information: http://carrierclass.net/
-->
    <head>
        <title>CarrierClass.net Management Platform</title>
        
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="Content-Style-Type" content="text/css" />
        <meta http-equiv="Content-Script-Type" content="text/javascript" />

  	    <script src="js/jquery.js" type="text/javascript"></script>
        <script src="js/jquery.history_remote.pack.js" type="text/javascript"></script>
        <script src="js/jquery.tabs.pack.js" type="text/javascript" type="text/javascript"></script>
  	    <script src="js/jquery.cookie.js" type="text/javascript"></script>
  	    <script src="js/jquery.geturlparam.js" type="text/javascript"></script>
  	    <script src="js/jquery.interface.js" type="text/javascript"></script>
  	    <script src="js/jquery.form.js" type="text/javascript"></script>

      	<script>
      	jQuery.noConflict();
      	function log(str) { jQuery("#log").append(str); }

      	jQuery(document).ready(function($){
            function get_value(name) {
                var r2 = $.getURLParam(name);  if(r2) return r2;
                var r1 = $.cookie(name); if(r1) return r1;
                return undefined;
            }
            var the_group = get_value('.group');
            var the_login = get_value('.login');
            var the_session = get_value('.session');
            $('link[@rel*=style]').each(function(i) {
                this.href.replace(/theme\//, 'theme/'+the_group+'/');
            });
            $.cookie('.group',the_group);
            $.cookie('.login',the_login);
            $.cookie('.session',the_session);

            // Hide/show items in sidebar
      		$("dd.auto:not(:first)").hide();
      		$("dt.auto a").click(function(){
      			$("dd:visible").slideUp("fast");
      			$(this).parent().next().slideDown("fast");
      			return false;
      		});

            // Code for live tables
            var intervals = {};

            var limit_cache = {};
            function the_limit_of(id){
                var the_limit;
                if( limit_cache[id] != undefined ) return limit_cache[id];
                $("#limit-"+id).each(function(){the_limit=parseInt(this.title,10)});
                limit_cache[id] = the_limit;
                return the_limit;
            }

            var max_cache = {};
            function the_max_of(id){
                var the_max;
                if( max_cache[id] != undefined ) return max_cache[id];
                $("#max-"+id).each(function(){the_max=parseInt(this.title,10)});
                max_cache[id] = the_max;
                return the_max;
            }

            var offset_cache = {};
            function the_offset_of(id){
                var the_offset;
                if( offset_cache[id] != undefined ) return offset_cache[id];
                $("#offset-"+id).each(function(){the_offset=parseInt(this.title,10)});
                offset_cache[id] = the_offset;
                return the_offset;
            }

            function set_the_offset_of(id,the_offset){
                offset_cache[id] = the_offset;
                // $("#offset-"+id).each(function(){this.title=the_offset});
            }

            function row_update(id,the_offset) {
                var tr_at = the_offset-the_offset_of(id);
                if( tr_at < 0 || tr_at >= the_limit_of(id) )    return;

                if(intervals["cache-"+id+the_offset] != undefined)
                {
                    clearInterval(intervals["cache-"+id+the_offset]);
                }

                $('#'+id+" tr:eq("+(tr_at+1)+")").empty().each(function(i){
                    this.innerHTML = the_value_at(id,the_offset+i);
                });
            }

            var cache = {};
            
            function clean_leave()
            {
                cache = {};
                limit_cache = {};
                max_cache = {};
                offset_cache = {};
                for( var o in intervals )
                {
                    clearInterval(intervals[o]);
                }
                intervals = {};
                $('#content').empty().append('<img src="/img/loading.gif" border="0" />');
            }

            function auto2_click() {
                clean_leave();
                var the_param = $(this.parentNode).children('input[@name=param]').val();
                $("#content").load("cgi/content.pl?"+the_param,on_load_content);
                // +"&.group="+the_group+"&.login="+the_login+"&.session="+the_session
                return false;
            }

            function the_value_at(id,offset) {
                var the_max = the_max_of(id);
                if( offset < 0 || offset >= the_max ) return '';
                if( cache[id] == undefined )    cache[id] = {};
                if( cache[id][offset] == undefined )
                {
                    // Do not query again if a timer is already engaged for this value.
                    if( intervals["cache-"+id+offset] == undefined )
                    {
                        // Pre-fetch
                        var the_limit = the_limit_of(id)*3;
                        if( offset+the_limit >= the_max ) the_limit = the_max-offset;

                        var j;
                        for( j = offset; j < offset+the_limit; j++ )
                        {
                            if( intervals["cache-"+id+j] == undefined )
                            {
                                intervals["cache-"+id+j] = setInterval(function(){ row_update(id,j); },3);
                            }
                        }

                        // Value is unknown and we are not already querying it.
                        var the_params;
                        $("#params-"+id).each(function(){the_params=this.title});
                        $.getJSON('cgi/get.pl?.as=json&.offset='+offset+'&.limit='+the_limit+'&'+the_params,
                            function(json){
                                var i;
                                for( i = 0; i < json.length; i++ )
                                {
                                    var this_offset = offset+i;
                                    cache[id][this_offset] = json[i];
                                    row_update(id,this_offset);
                                }
                                
                                $(".auto2").click(auto2_click);

                            });
                    }
                }

                if( cache[id][offset] != undefined )    return cache[id][offset];
                return '<td><img src="/img/loading.gif" border="0" /></td>';
            }


            function table_update(id,start_at) {
                set_the_offset_of(id,start_at);
                $('#'+id+" tr:gt(0)").each(function(i){
                    this.innerHTML = the_value_at(id,start_at+i);
                });
            }

            function table_up(id) {
                // Shift down, Insert at top
                var the_offset = the_offset_of(id);
                if( the_offset >= 1 ) {
                    table_update(id,the_offset-1);
                }
            }

            function table_down(id) {
                // Shift up, Insert at bottom
                var the_offset = the_offset_of(id);
                var the_limit  = the_limit_of(id);
                var the_max    = the_max_of(id);
                if( the_offset + the_limit < the_max )
                {
                    table_update(id,the_offset+1);
                }
            }

            function table_slide(id,amt) {
                var scale = the_max_of(id)-the_limit_of(id);
                if( scale < the_limit_of(id) ) scale = the_limit_of(id);
                var new_offset = Math.floor(amt*scale/100.0);
                if( new_offset < 1 ) new_offset = 0;
                if( new_offset + the_limit_of(id) >= the_max_of(id) ) new_offset = the_max_of(id) - the_limit_of(id);
                if( new_offset < 1 ) new_offset = 0;
                if( new_offset != the_offset_of(id) ) table_update(id,new_offset);
            }


            // These get executed each time a "content" page gets loaded.
            function on_load_content() {

                // Tables
                $(".auto2").click(auto2_click);
                // Use jQuery.interface's Tooltip for help
                $("label").ToolTip(
                    {
                        className: 'helpTooltip',
                        position: 'mouse',
                        delay: 200
                    }
                );

                $(".tab-container").tabs();

                // Button at the top of the scrollbar
                $('.button-up').mousedown(function(){
                    var the_id = this.id.substring(3);
                    intervals[the_id] = setInterval(function(){table_up('table-'+the_id)},1);
                }).mouseup(function(){
                    var the_id = this.id.substring(3);
                    clearInterval(intervals[the_id]);
                    intervals[the_id] = undefined;
                });

                // The scrollbar itself
                $('.vertical-slider').each(function(){
                    var the_id = this.id.substring(3);
                    $(this).Slider(
                    	{
                    		accept : '#indicator-'+the_id,
                    		onSlide : function( cordx, cordy )
                    		{
                                table_slide('table-'+the_id,cordy); // percentages
                    		},
                    		onChange : function( cordx, cordy )
                    		{
                                table_slide('table-'+the_id,cordy); // percentages
                    		},
                    		values: [ [0,0] ]
                    	});
                    // Prime the cache
                    the_value_at("table-"+the_id,0);
                });

                // Button at the bottom of the scrollbar
                $('.button-down').mousedown(function(){
                    var the_id = this.id.substring(3);
                    intervals[the_id] = setInterval(function(){table_down('table-'+the_id)},1);
                }).mouseup(function(){
                    var the_id = this.id.substring(3);
                    clearInterval(intervals[the_id]);
                    intervals[the_id] = undefined;
                });

                var options = { 
                    target: '#content',
                    beforeSubmit: 
                        function(the_form_data,the_form_jquery_object,the_options) {
                            clean_leave();
                            // Check any parameters here!
                        },
                    success:
                        function(the_response) {
                            on_load_content();
                        }
                };
                $('form').ajaxForm(options);

                // Lists / trees
                function open_dl(o) {
                    $(o).unbind("click").removeClass('openable-closed').addClass('openable-open').
                    click(function(){close_dl(o)}).
                    parent().children('dd').show();
                }
                function close_dl(o) {
                    $(o).unbind("click").removeClass('openable-open').addClass('openable-closed').
                    click(function(){open_dl(o)}).
                    parent().children('dd').hide();
                }
                $('dt.openable-closed').each(function(){close_dl(this)});
                $('dt.openable-open').each(function(){open_dl(this)});
                
                // TBD
                // For each $('.searchbox'), appends this.name+"=search "+this.value to the context param of
                // the CGI query contained in the href of each $('a.more') child.
            } // end of on_load_content()

            // Links in sidebar
            $("a.auto").click(function(){
                clean_leave();
                $("#content").load("cgi/content.pl?.id="+this.id,on_load_content);
                return false;
            }).each(function(i){
                // Hide items that this user cannot activate.
                var what = this;
                // YYY commented the two lines below -- this is definitely not the right way to do it.
                // $.getJSON("cgi/can_do.pl",{'.item':this.id},function(json){
                //    if(json.can_do != "true") {$(what).fadeOut();}
                // });
            });

      	});
      	</script>

        <link rel="stylesheet" href="css/jquery.tabs.css" type="text/css" media="print, projection, screen">
        <!-- Additional IE/Win specific style sheet (Conditional Comments) -->
        <!--[if lte IE 7]>
        <link rel="stylesheet" href="css/jquery.tabs-ie.css" type="text/css" media="projection, screen">
        <![endif]-->

        <link rel="stylesheet" href="theme/screen.css" type="text/css" media="screen" />
        <link rel="stylesheet" href="theme/print.css" type="text/css" media="print" />

    </head>
    <body>
        <div id="container">
            <div id="header">
            </div>
            <div id="sidebar">
                <dl>
                	<dt class="auto"><a id="ui_apply_changes" class="auto">Apply changes</a></dt>
                    <dd></dd>
                	<dt class="auto"><a id="ui">User Interface</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/Community%20Help.png" border="0"> -->
                	<ul>
                		<li><a id="ui_group_list"      class="auto">Manage Users and Groups</a></li>
                		<li><a id="ui_group_theme"                 >Themes</a></li>
                		<!-- <li><a id="create:person"      class="auto">Add a person</a></li> -->
                		<li><a id="ui_summary"         class="auto">Summary</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="config">Server Provisioning</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/configure.png" border="0"> -->
                	<ul>
                		<li><a id="system_list" class="auto">Systems</a></li>
                		<li><a id="server_list" class="auto">Servers</a></li>
                		<li><a id="cluster_list" class="auto">Clusters</a></li>
                        <li><a id="server_network_list" class="auto">Network services</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="manage">Phone Provisioning</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/3d.png" border="0"> -->
                	<ul>
                		<li><a id="enterprise_list" class="auto">Enterprises</a></li>
                        <li><a id="extension_list"  class="auto">Extensions</a></li>
                		<li><a id="pool_list"       class="auto">Pools</a></li>
                        <li><a id="phone_list"      class="auto">Phones</a></li>
                        <li><a id="line_list"       class="auto">Line appearances</a></li>
                        <li><a id="phone_login"     class="auto">Phone logins / passwords</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="manage">Trunks</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/3d.png" border="0"> -->
                	<ul>
                		<li><a id="trunk_list"          class="auto">Trunks/Gateways</a></li>
                		<li><a id="proxy_route_list"    class="auto">Proxy-based routing</a></li>
                        <li><a id="inbound_list"        class="auto">Inbound routing</a></li>
                        <li><a id="outbound_list"       class="auto">Outbound routing</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="manage">Call Routing</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/3d.png" border="0"> -->
                	<ul>
                        <li><a id="extensions_route_list"           class="auto">Extensions Routes</a></li>
                		<li><a id="named_map_list"                  class="auto">Named Maps</a></li>
                		<li><a id="map_patterns_list"               class="auto">Pattern Maps</a></li>
                        <li><a id="menu_list"                       class="auto">Menus / ACD</a></li>
                        <li><a id="queue_list"                                  >Queues</a></li>
                        <li><a id="ring_group_list"                 class="auto">Ring Groups</a></li>
                		<li><a id="named_cos_list"                  class="auto">Named CoS</a></li>
                		<li><a id="cos_route_list"                  class="auto">CoS definition</a></li>
                		<li><a id="enterprise_routing"              class="auto">Enterprise Routing Plan</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="manage">Emergency Call Routing</a></dt>
                	<dd class="auto">
                	<!-- <img src="img/128x128/3d.png" border="0"> -->
                	<ul>
                		<li><a id="pool_ertrunk_list"   class="auto">Pool-based</a></li>
                		<li><a id="erl_list"            class="auto">Emergency Routing Locations</a></li>
                	</ul>
                	</dd>
                	<dt class="auto"><a id="perf">Monitoring</a></dt>
                	<dd class="auto">
                	<img src="img/128x128/All%20software%20is%20current.png" border="0">
            	    <ul>
                		<!-- <li><a id="ticket_list"         class="auto">Local tickets</a></li> -->
            	    </ul>
                	</dd>
                	<dt class="auto"><a id="billing">Billing</a></dt>
                	<dd class="auto">
                	<img src="img/128x128/kcmpartitions.png" border="0">
                	<ul>
                    </ul>
                    </dd>
                </dl>
                <ul>
                    <li><a href="index.html?logout=done" id="logout">Logout</a>
                    <li><a href="license.html" id="license" class="auto">License</a>
                        <a href="about.html" id="about" class="auto">About</a>
                </ul>
                <div id="log"></div>
                <div id="info"></div>
            </div>
            <div id="content"></div>
        </div>
  </body>
</html>
